<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./layout/newTemplate.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"  
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns="http://www.w3.org/1999/xhtml">

    <ui:define name="content">
        <p:messages id="messag" showDetail="true"  autoUpdate="true" closable="true" > 
            <p:effect type="fade" event="load" delay="#{gestorPrincipal.delayMessage}" />
        </p:messages>
        <f:metadata>
            <f:viewParam name="aso" value="#{web.aso}" />
            <f:event type="preRenderView" listener="#{web.testFunc()}" />
        </f:metadata>

        <p:panel header="Directorio">
            <p:dataGrid var="per" value="#{gestorDirectorio.directiva}" columns="1" >  

                <p:panel header="#{per.cargo.descripcion}"> 
                    <h:panelGrid columns="1" style="width:100%" styleClass="gridNormal">  

                        <p:panelGrid columns="2" styleClass="gridNormal">
                            <p:graphicImage width="100" height="100" rendered="#{per.imagen != null and per.imagen != ''}" value="#{per.imagen}"/>
                            <p:panelGrid columns="2" styleClass="gridNormal">
                                <p:outputLabel value="Nombres"/>
                                <p:outputLabel value="#{per.nombres}"/>

                                <p:outputLabel value="Apellidos"/>
                                <p:outputLabel value="#{per.apellidos}"/>

                                <p:outputLabel value="Teléfono"/>
                                <p:outputLabel value="#{per.telefono}"/>

                                <p:outputLabel value="E-email"/>
                                <h:panelGroup layout="block">
                                    <a href="mailto:#{per.email}">#{per.email}</a>
                                </h:panelGroup>
                            </p:panelGrid>
                        </p:panelGrid>

                        <h:outputText value="#{gal.descripcion}" />  

                    </h:panelGrid>  
                </p:panel>  
            </p:dataGrid>              
        </p:panel>
    </ui:define>
</ui:composition>